<style lang='sass'>
  @import './ecstyle.scss'
</style>
<template>
  <div class="ec-home" :style="{minHeight: height + 'px'}">
    <div v-if="!isClose">
      <el-main :class="classTheme" style="padding: 0px;">
        <!-- 企业banner，包含logo，企业名称，企业资质 -->
        <div class="banner-logo">
          <div class="ec-logo">
            <img :src="ec.enterpriseLogo" class="img-responsive" alt="" @click="$showImg(ec.enterpriseLogo)">
            <!-- <div class="zoomImage" :style="{backgroundImage: 'url(' + ec.enterpriseLogo + ')'}"></div> -->
          </div>
          <p class="ec-ename">{{ec.enterpriseName}}</p>
          <p class="ec-equalification"><strong>企业资质：{{getEQ(ec.enterpriseQualification)}}</strong></p>
        </div>
        <!-- 企业标签 -->
        <div class="ec-tags">
          <label v-if="ec.tags.length > 0"><strong>企业标签:</strong>&nbsp;&nbsp;</label>
          <span :key="tag.tagId"
          v-for="tag in ec.tags">{{tag.tagName}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
        </div>
        <!-- 企业简介 -->
        <div class="ec-profile">
          <h2>企业简介</h2>
          <p v-html="replaceEnter(ec.enterpriseSummary)"></p>
        </div>

        <!-- 企业联系方式 -->
        <div class="ec-contact">
          <h2>联系我们</h2>
          <div class="">
            <el-row :gutter="20">
              <el-col :span="6">
                <div class="ec-contact-card">
                  <label>联系人</label>
                  <p>{{ec.enterpriseContacts}}</p>
                </div>
              </el-col>
              <el-col :span="6">
                <div class="ec-contact-card">
                  <label>联系方式</label>
                  <p>{{ec.enterpriseContactsPhone}}</p>
                </div>
              </el-col>
              <el-col :span="6">
                <div class="ec-contact-card">
                  <label>企业邮箱</label>
                  <p>{{ec.email}}</p>
                </div>
              </el-col>
              <el-col :span="6">
                <div class="ec-contact-card">
                  <label>企业地址</label>
                  <p>{{ec.cityName}}</p>
                  <p>{{ec.enterpriseAddress}}</p>
                </div>
              </el-col>
            </el-row>
          </div>
        </div>
        <div class="ec-home-content">
          <!-- 产品展示 -->
          <div class="ex-common-class echome-pd" v-if="ec.mscsProductDisplayList.length > 0" style="padding: 10px 0 60px 0;margin-top: 60px;">
            <h2>产品展示</h2>
            <div class="flex-row" v-for="(item, index) in ec.mscsProductDisplayList" :key="index" style="margin-top: 50px;">
              <!-- <img :src="item.image" class="img-responsive" alt=""> -->
              <div class="echome-content-img" style="width: 300px;height: 200px;">
                <!-- <div class="zoomImage" :style="{backgroundImage: 'url(' + item.image + ')'}"></div> -->
                <div class="zoomImage-66" v-lazy:background-image="item.image" @click="$showImg(item.image)"></div>
                <!-- <img :src="item.image" class="img-responsive" alt=""> -->
              </div>

              <div class="flex-all" style="margin-left: 50px;margin-right: -30px;">
                <p>{{item.title}}</p>
                <p v-html="replaceEnter(item.content)"></p>
              </div>
            </div>
          </div>

          <!-- 专家 -->
          <div class="ex-common-class echome-en" v-if="ec.mscsEnterpriseExpertList.length > 0" style="padding: 10px 0 60px 0;margin-top: 60px;">
            <h2>企业专家</h2>
            <div class="flex-row" style="justify-content: center;flex-wrap: wrap;">
              <div class="flex" v-for="(item, index) in ec.mscsEnterpriseExpertList" :key="index">
                <div class="echome-content-img" style="width: 250px;height: 250px;">
                  <!-- <div class="zoomImage" :style="{backgroundImage: 'url(' + item.image + ')'}"></div> -->
                  <div class="zoomImage" v-lazy:background-image="item.image" @click="$showImg(item.image)"></div>
                  <!-- <img :src="item.image" class="img-responsive" alt=""> -->
                </div>
                <!-- <img :src="item.image" alt=""> -->
                <p>{{item.expertName}}</p>
                <p v-html="replaceEnter(item.introduce)"></p>
              </div>
            </div>
          </div>

          <!-- 优质案例 -->
          <div class="ex-common-class echome-mbc" v-if="ec.mscsBusinessCasesList.length > 0" style="padding: 10px 0 60px 0;margin-top: 60px;">
            <h2>优质案例</h2>
            <div class="flex-row" v-for="(item, index) in ec.mscsBusinessCasesList" :key="index" style="margin-top: 50px;">
              <div class="flex-all">
                <p>{{item.title}}</p>
                <p v-html="replaceEnter(item.content)"></p>
              </div>
            </div>
          </div>

          <!-- 解决方案 -->
          <div class="ex-common-class echome-msp" v-if="ec.mscsSolutionProgramList.length > 0" style="padding: 10px 0 60px 0;margin-top: 60px;">
            <h2>解决方案</h2>
            <div class="flex-row" v-for="(item, index) in ec.mscsSolutionProgramList" :key="index" style="margin-top: 50px;">
              <div class="flex-all">
                  <p>{{item.title}}</p>
                  <p v-html="replaceEnter(item.content)"></p>
              </div>
            </div>
          </div>

          <!-- 企业荣誉 -->
          <div class="ex-common-class echome-hn" v-if="ec.mscsEnterpriseHonorList.length > 0" style="padding: 10px 0 60px 0;margin-top: 60px;">
            <h2>企业荣誉</h2>
            <div class="flex-row" style="justify-content: center;flex-wrap: wrap;">
              <div class="flex" id="eh-expert" v-for="(item, index) in ec.mscsEnterpriseHonorList" :key="index">
                <div class="echome-content-img" style="width: 200px;height: 140px;">
                  <!-- <div class="zoomImage" :style="{backgroundImage: 'url(' + item.image + ')'}"></div> -->
                  <div class="zoomImage-70" v-lazy:background-image="item.image" @click="$showImg(item.image)"></div>
                  <!-- <img :src="item.image" class="img-responsive" alt=""> -->
                </div>

                  <p>{{item.honorName}}</p>
              </div>
            </div>
          </div>
        </div>
      </el-main>
      <div class="d-flex flex-column align-items-center mb-5">
        <div class="main-width" style="margin-top: 20px;" >
          <el-button class="fr" type="success" plain round @click="liked()" :loading="likeloading">
            <span>{{(ec.like === 0 || ec.like === '0') ? '点赞' : '已点赞'}}</span> |
            <span>{{ec.likeNumber}}</span>
          </el-button>
        </div>
        <div class="main-width" v-if="ec.isComment === 'YES'">
          <ec-comments :coms.sync="ec.comment" :info="{enterpriseId: enterpriseId}" modelType="activity"></ec-comments>
        </div>
      </div>
      <back-top></back-top>
    </div>
    <div class="flex-column-center promp-msg" style="padding-top: 200px;" v-if="isClose">
      <img src="../../assets/gongnengtishi.png" alt="">
      <h3>非常抱歉，你所查看得企业主页暂时无法预览</h3>
    </div>
  </div>
</template>

<script>
import { openLogin, loginOut } from '../login/autologin'
import axios from 'axios'
import EcComments from './EcComments'

let getAllEcData = async function (self, id) {
  self.enterpriseId = id
  let obj = {enterpriseId: id}
  if (self.$store.state.user.isLogin) {
    obj.userId = self.$store.state.user.user.user.userId
  }
  // 获取企业内容
  let ec = await axios.post('/mscs/home/findEnterpriseContentById', self.$paramsConvert(obj))
  if (ec.data.code !== 1) {
    self.$codeError(ec)
    return
  }
  // 企业被关闭，暂时无法预览
  if (ec.data.data.data.status === 'REVOKE') {
    self.isClose = true
    return
  }
  // self.ec = Object.assign({}, self.ec, resEc.data.data)
  let ecChild = await axios.post('/mscs/home/findEnterpriseOtherData', self.$paramsConvert(obj))
  self.ec = Object.assign({}, ec.data.data.data)
  self.ec.like = ec.data.data.like
  self.ec.likeNumber = ec.data.data.likeNumber
  self.ec.mscsProductDisplayList = ecChild.data.data.eroductDisplay
  self.ec.mscsEnterpriseExpertList = ecChild.data.data.enterpriseExpert
  self.ec.mscsEnterpriseHonorList = ecChild.data.data.enterpriseHonor
  self.ec.mscsSolutionProgramList = ecChild.data.data.solutionProgram
  self.ec.mscsBusinessCasesList = ecChild.data.data.businessCases
  self.themeIndex = self.ec.theme
  self.ec.tags = JSON.parse(ec.data.data.data.tags)

  // 获取评论内容
  let resComment = await axios.post('/mscs/home/findCommentByType', self.$paramsConvert(obj))
  self.ec.comment = resComment.data.data
}
export default {
  title: '企业主页',
  name: 'ec-home',
  data () {
    return {
      enterpriseId: '',
      isClose: false,
      ec: {
        data: {},
        like: '0',
        likeNumber: 0,
        comment: {},
        tags: [],
        mscsProductDisplayList: [],
        mscsEnterpriseExpertList: [],
        mscsEnterpriseHonorList: [],
        mscsSolutionProgramList: [],
        mscsBusinessCasesList: []
      },
      likeloading: false, // 点在的按钮禁止
    }
  },
  mounted () {
    // 企业详情也不用必须登录和为会员
    // if (!this.isVip && this.$store.state.user.isLogin) {
    //   this.getUserType()
    // }
  },
  methods: {
    // 点赞
    liked () {
      if (!this.isLogin) {
        openLogin()
      } else {
        this.likeloading = true
        axios.post('/mscs/home/userLikeOrCancel', this.$paramsConvert({
          type: (this.ec.like === 0 || this.ec.like === '0') ? 'LIKE' : 'CANCEL',
          enterpriseId: this.enterpriseId,
          userId: this.$store.state.user.user.user.userId
        })).then((res) => {
          if (res.data.code === 1) {
            if (this.ec.like === 0 || this.ec.like === '0') {
              this.ec.like = 1
              this.ec.likeNumber = parseInt(this.ec.likeNumber) + 1
            } else {
              this.ec.like = 0
              this.ec.likeNumber = parseInt(this.ec.likeNumber) - 1
            }
          }
        }).catch((error) => {
          // debugger
          this.$catchError(error)
        }).finally(() => {
          this.likeloading = false
        })
      }
    },
    // getUserType () {
    //   axios.post('/mscs/user/findUserType', this.$paramsConvert({userId: this.$store.state.user.user.user.userId})).then((res) => {
    //     if (res.data.code === 1) {
    //       this.$store.commit('upUserType', {userType: res.data.data.userType})
    //     }
    //   })
    // },
    getEQ (str) {
      let eq = ''
      switch (str) {
        case 'A':
          eq = '甲级'
          break;
        case 'B':
          eq = '乙级'
          break;
        case 'C':
          eq = '丙级'
          break;
        case 'D':
          eq = '丁级'
          break;
        case 'N':
          eq = '非资质单位'
          break;
      }
      return eq
    },
    replaceEnter (str) {
      if (str) {
        return str.replace(/\n|\r\n/g,"<br/>")
      }
      return ''
    }
  },
  beforeRouteEnter (to, from, next) {
    next(vm => {
      getAllEcData(vm, vm.$uncompileStr(to.params.id)).then(res => {}).catch(error => {
        vm.$catchError(error)
      })
    })
  },
  computed: {
    classTheme () {
      let index = parseInt(this.ec.theme)
      if (index === 0) {
        return 'light-green-ec'
      } else if (index === 1) {
        return 'blue-ec'
      } else if (index === 2) {
        return 'dark-green-ec'
      } else if (index === 3) {
        return 'default-ec'
      }
      return 'light-green-ec'
    },
    height () {
      return this.$store.state.height.client - this.$store.state.height.header - this.$store.state.height.footer
    },
    // isVip () {
    //   return this.$store.state.user.user &&
    //   (this.$store.state.user.user.user.userType === 'MEMBER' || this.$store.state.user.user.user.userType === 'CMEMBER') &&
    //   this.$store.state.user.user.memberStatus === "NORMAL" &&
    //   this.$store.state.user.user.paymentStatus === "ALREADY"
    // },
    isLogin () {
      return this.$store.state.user.isLogin
    },
  },
  components: {
    'ec-comments': EcComments
  }
}
</script>
